<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<!DOCTYPE html>
<html lang="en">
<head>
<!-- 访问的基本路径,此页面的所有的跳转都是基于此地址作为基本地址 -->
<base href="<%=basePath%>">

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta charset="utf-8" />
<title>登录页面</title>

<meta name="description" content="User login page" />
<meta name="viewport"
	content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />

<!-- bootstrap & fontawesome -->
<link rel="stylesheet" href="resources/assets/css/bootstrap.min.css" />
<link rel="stylesheet"
	href="resources/assets/font-awesome/4.5.0/css/font-awesome.min.css" />

<!-- text fonts -->
<link rel="stylesheet"
	href="resources/assets/css/fonts.googleapis.com.css" />

<!-- ace styles -->
<link rel="stylesheet" href="resources/assets/css/ace.min.css" />

<link rel="stylesheet" href="resources/assets/css/ace-rtl.min.css" />

</head>

<body class="login-layout">
	<div class="main-container">
		<div class="main-content">
			<div class="row">
				<div class="col-sm-10 col-sm-offset-1">
					<div class="login-container">
						<div class="center">
							<h1>
								<i class="ace-icon fa fa-leaf green"></i> <span class="white"
									id="id-text2">质押系统登录页面</span>
							</h1>
							<h4 class="blue" id="id-company-text">&copy; 广州尚学堂</h4>
						</div>

						<div class="space-6"></div>

						<div class="position-relative">
							<div id="login-box"
								class="login-box visible widget-box no-border">
								<div class="widget-body">
									<div class="widget-main">
										<h4 class="header blue lighter bigger">
											<i class="ace-icon fa fa-coffee green"></i> 请输入登录信息
										</h4>

										<div class="space-6"></div>

										<form id="loginForm" method="post">
											<fieldset>
												<label class="block clearfix"> <span
													class="block input-icon input-icon-right"> <input
														type="text" name="admin_name" class="form-control"
														placeholder="用户名" /> <i class="ace-icon fa fa-user"></i>
												</span>
												</label> <label class="block clearfix"> <span
													class="block input-icon input-icon-right"> <input
														type="password" name="admin_pass" class="form-control"
														placeholder="密码" /> <i class="ace-icon fa fa-lock"></i>
												</span>
												</label>

												<div id="errorMsg" style="color: red"></div>

												<div class="clearfix">

													<button type="submit"
														class="width-35 pull-right btn btn-sm btn-primary">
														<i class="ace-icon fa fa-key"></i> <span
															class="bigger-110">登录</span>
													</button>
												</div>

												<div class="space-4"></div>
											</fieldset>
										</form>



									</div>
									<!-- /.widget-main -->


								</div>
								<!-- /.widget-body -->
							</div>
							<!-- /.login-box -->

						</div>
						<!-- /.position-relative -->


					</div>
				</div>
				<!-- /.col -->
			</div>
			<!-- /.row -->
		</div>
		<!-- /.main-content -->
	</div>
	<!-- /.main-container -->

	<!-- basic scripts -->

	<!--[if !IE]> -->
	<script src="resources/assets/js/jquery-2.1.4.min.js"></script>
	<!-- 表单校验框架 -->
	<script src="resources/js/jquery.validate.min.js"></script>

	<script type="text/javascript">
		$(function() {
			//表单校验
			$("#loginForm").validate({
				rules : {
					admin_name : {
						required : true
					},
					admin_pass : {
						required : true
					}
				},
				messages : {
					admin_name : {
						required : "亲,账号不能为空"
					},
					admin_pass : {
						required : "密码不能为空"
					}
				},
				/* 校验完毕触发的事件 */
				submitHandler : function() {
					//1.序列化表单获取页面的所有表单元素的数据
					var formData = $("#loginForm").serialize();
					console.log(formData);
					//2.使用ajaxpost提交,向后台提交数据
					$.post("index/login.do", formData, function(data) {

						if (data.code == 0) {
							//登录失败
							$("#errorMsg").text(data.msg);
						} else {
							//登录成功,跳转到后台首页
							window.location.href = "index/home.do"
						}

					});
				}

			})

		})
	</script>


</body>
</html>
